

<template>
  <div class="addUpdate">
    <ViewTitle text="基础信息" />
    <div class="box1">
      <div>
        <span>病人姓名:</span>
        <el-input
          size="mini"
          disabled
          v-model="thatF.skinTestData.member_info.name"
          placeholder="请输入病人姓名"
        ></el-input>
      </div>
      <div>
        <span>卡号:</span>
        <el-input
          size="mini"
          disabled
          v-model="thatF.skinTestData.member_info.id_card"
        ></el-input>
      </div>
      <div>
        <span>性别:</span>
        <el-input
          size="mini"
          disabled
          v-model="$baseBai['gender'][thatF.skinTestData.member_info.gender-1].label"
        ></el-input>
      </div>
      <div>
        <span>年龄:</span>
        <el-input
          disabled
          size="mini"
          type="number"
          v-model="thatF.skinTestData.member_info.age"
          placeholder="请输入内容"
        ></el-input>
      </div>
    </div>

    <ViewTitle text="皮试信息" />

    <div class="box1">
      <div>
        <span>药品名称:</span>
        <el-input
          disabled
          size="mini"
          v-model="thatF.skinTestData.drug_name"
          placeholder="药品名称"
        ></el-input>
      </div>

      <div>
        <span>药品规格:</span>
        <el-input
          disabled
          size="mini"
          v-model="thatF.skinTestData.usage"
          placeholder="请选择科室"
        ></el-input>
      </div>
          <div>
        <span>皮试批号:</span>
        <el-input
            v-if="thatF.skinTest_status==1"
          size="mini"
          v-model="params.fill_no"
          placeholder="请输入皮试批号"
        ></el-input>
      </div>
      <div style="width: 100%"  v-if="thatF.skinTest_status==1">
        <span>皮试结果:</span>
        <el-radio v-model="params.result" label="1">阴性</el-radio>
        <el-radio v-model="params.result" label="2">阳性</el-radio>
      </div>

       <div style="width:60%"  v-if="thatF.skinTest_status==1">
        <span>时间：</span>
        <el-date-picker

          v-model="params.start_time"
          type="datetimerange"
          range-separator="至"
        
          value-format="yyyy-MM-dd HH-mm-ss"
          start-placeholder="开始时间"
          end-placeholder="结束时间"
        >
        </el-date-picker>
      </div>
        <div style="width:60%"  v-if="thatF.skinTest_status==1" >
          <span style="width:70px">皮试说明:</span>
          <el-input
            style="margin-top: 15px"
            type="textarea"
            :rows="3"
            placeholder="请输入备注"
            v-model="params.description"
          >
          </el-input>
        </div>
     <div  v-if="thatF.skinTest_status==2">
        <span>皮试批号:</span>
        <el-input
           
          size="mini"
          disabled
          v-model="thatF.SkinTestHistoryData[0].fill_no"
          placeholder="请输入皮试批号"
        ></el-input>
      </div>
      <div style="width: 100%"  v-if="thatF.skinTest_status==2">
        <span>皮试结果:</span>
        <el-radio disabled v-model="thatF.SkinTestHistoryData[0].result" label="1">阴性</el-radio>
        <el-radio  disabled v-model="thatF.SkinTestHistoryData[0].result" label="2">阳性</el-radio>
      </div>

       <div style="width:60%"  v-if="thatF.skinTest_status==2">
        <span>时间：</span>
         <el-input
            v-if="thatF.skinTest_status==2"
          size="mini"
          disabled
          v-model="thatF.SkinTestHistoryData[0].start_time"
          placeholder="请输入皮试批号"
        ></el-input>
        <span style="padding:0 5px">至</span>
        <el-input
            v-if="thatF.skinTest_status==2"
          size="mini"
          disabled
          v-model="thatF.SkinTestHistoryData[0].end_time"
          placeholder="请输入皮试批号"
        ></el-input>
     
      </div>
        <div style="width:60%"  v-if="thatF.skinTest_status==2" >
          <span style="width:70px">皮试说明:</span>
          <el-input
          disabled
            style="margin-top: 15px"
            type="textarea"
            :rows="3"
            placeholder="请输入备注"
            v-model="thatF.SkinTestHistoryData[0].description"
          >
          </el-input>
        </div>
    
    </div>

  
    <ViewTitle text="历史记录" />
    <div class="box3">
      <table>
        <el-table 
          border
          height="250"
        
          :data="thatF.SkinTestHistoryData"
         style="width:100%"
        > 
          <el-table-column type="index" label="序号" width="50">  </el-table-column>
          <el-table-column prop="created_at" label="日期" >
          </el-table-column>
          <el-table-column prop="fill_no" label="药品批号" >
          </el-table-column>
          <el-table-column prop="result" label="结果">
             <template slot-scope="scope">
                    <span v-if="scope.row.result==1">
                        阴性
                    </span>
                     <span v-if="scope.row.result==2">
                        阳性
                    </span>
                  </template>
          </el-table-column>
            <el-table-column prop="description" label="说明" >
          </el-table-column>
            <el-table-column prop="start_time" label="开始时间" >
          </el-table-column>
          <el-table-column prop="end_time" label="结束时间">
          </el-table-column>
        </el-table>
      </table>
    </div>
      <div style=" text-align: center;" v-if="thatF.skinTest_status==1">
        <el-button style="width:200px" class="butB_Add"  @click="save">保存</el-button>
    </div>
  </div>
</template>
<script>
import ViewTitle from "@/forComponents/viewTitle/index.vue";

export default {
  props: ["thatF"],
  data() {
    return {
      visibleDoctor: false,
      search: "",
      showAddUserInfo: false,
      params: {
        recipe_drug_id: "",
        result: "",
        description: "",
        start_time: "",
        end_time: "",
        fill_no:'',
      },

      tableData: [
        {
          id: "1",
          name: "挂号费",
          price: 10,
        },
        {
          id: "2",
          name: "诊查费",
          price: 10,
        },
        {
          id: "3",
          name: "预约费",
          price: 10,
        },
      ],
    };
  },
  methods: {
   
    save() {
      let d = {
        recipe_drug_id: this.thatF.skinTestData.id,
        result:this.params.result,
        description:this.params.description,
        start_time:this.params.start_time[0],
        end_time:this.params.start_time[1],
        fill_no:this.params.fill_no,
      };



      
                for(let key in d){
                      if(!d[key])
                      return  this.$message.error('请填写资料完整后再进行提交');
                }


                   
            this['_API'].getClinic_nurseSkinTestSave(d).then(res=>{
                    if(res.code==200){
                          this.$message({
                                message: res.message,
                                type: 'success'
                            });
                          this.thatF.params.page=1;
                           // this.$emit('openUserInfo',this.params,res.data);
                            this.thatF.show_skinTestSave=false;
                            this.thatF.getList()
                    }
            })
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    handleSelect() {},
    openUserInfo(...item) {
      if (item.length == 2) {
        this.params.id = item[1].id;
        this.params.name = item[1].name;
        this.params.id_card = item[1].id_card;
        this.params.gender = this.$baseBai["gender"][item[1].gender];
        this.params.age = item[1].age;
        this.params.birthday = item[1].birthday;
        this.params.phone = item[1].phone;
        this.params.address = item[1].address;
      } else {
        // this.$refs.UserInfo.params=  this.params;
      }

      this.showAddUserInfo = !this.showAddUserInfo;
    },
   
  },
  components: {
    ViewTitle,
    //  FormInfo
  },
};
</script>
<style lang='scss' scoped>
.addUpdate {
  padding: 0 5%;
  .box1 {
    display: flex;
    flex-wrap: wrap;
    padding: 20px 0;
    > div {
      position: relative;
      width: 33%;
      display: flex;
      align-items: center;
      // justify-content: center;
      margin-bottom: 20px;

      > span {
        display: inline-block;
        width: 65px;
      }
      /deep/ .el-input {
        width: 150px;
      }
    }
  }
  .box3 {
    margin: 20px 0;
  }

  .dukaBut {
    margin: 0px 0 20px;
  }
}
/deep/ .el-dialog__body {
  height: 70vh;
  overflow: scroll;
}
</style>